/*存放gep的颜色和字体等设置*/
/*第一层的设置*/
.gepD4-index-box {

}

.gepD4-layer1-left {
    width: 100%;
    height: 100%;
    flex: 3;
    display: flex;
    flex-direction: column;
    /*background-color: #0c133b;*/
    /*background: url("@/assets/img/bg/6.jpeg") no-repeat center center fixed;*/
}

.gepD4-layer1-right {
    /*background-color: #0c133b;*/
}

.gepD4-layer2-left-top {
    /*border: 1px red solid;*/
}

/*.gepD4-layer2-left-bottom {*/

/*}*/

.gepD4-select-region .el-cascader {
    /*background-color: red; !* 这里设置你想要的背景色 *!*/
}

.gepD4-select-title-font {
    font-size: 22px;
    font-weight: bold;
    color: #3adabf;
}

.gepD4-label {
    font-size: 16px;
    color: #6ff2f1;
    margin-bottom: 5px;
    padding-left: 10%;
}

/*第二层的设置*/
.gepD4-select-title-font {
    font-size: 32px;
    font-weight: bold;
    color: #3adabf;
}


/*右侧输入框的设置*/
/*input输入框的布局*/
.gepD4-input-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.gepD4-input-row {
    display: inline-block;
    width: 360px; /* 一行三个输入框，减去间隔 */
    margin-right: 10px;
    /*margin-top: 15px;*/
    margin-bottom: 15px;
    vertical-align: top; /* 确保输入框在行中垂直居中 */
    /*border: 1px solid red;*/
}

.gepD4-input-row label {
    display: inline-block;
    width: auto;
    min-width: 80px;
    font-size: 16px;
    /*color: #6ff2f1;*/
    text-align: left;
    margin-bottom: 5px;
    margin-left: 10px;

    color: rgba(251, 246, 246, 1);
    font-family: '微软雅黑 Light', serif;
    font-weight: 400;
    line-height: 31px;

}

.gepD4-input-row span {
    display: inline-block;
    margin-bottom: 5px;
    text-align: left;
    width: auto;
    /*border: 1px solid red;*/
}

.gepD4-input-row input {
    display: inline-block;
    font-size: 18px;
    text-align: -webkit-right;
    color: #d9db55;
    width: 120px;
    /*height: 30px;*/
    padding: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 8px;
    /*border: 1px solid #ccc;*/
    border-radius: 4px;
    background-color: #131b24; /* 设置背景为透明 */
}

/*input结束*/
/*按钮*/
/* 提交按钮特定样式 */
.gepD4-submit-button {
    background: #44a0d5; /* 胶囊按钮颜色 */
    color: white;
    font-size: 18px;
    width: 60px;
    height: 30px;
}

.gepD4-submit-button:hover {
    background: #45a049; /* 鼠标悬停效果 */
}

/* 清空按钮特定样式 */
.gepD4-clear-button {
    background: #37a1d6; /* 胶囊按钮颜色 */
    color: white;
    font-size: 18px;
    width: 60px;
    height: 30px;
}

.gepD4-clear-button:hover {
    background: #e53935; /* 鼠标悬停效果 */
}


.gepD4-value-output {
    font-size: 16px;
    color: #d9db55;
    width: calc(100% - 10px); /* 减去padding的宽度 */
    padding: 5px;
    margin-bottom: 10px;
    background-color: transparent; /* 设置背景为透明 */
}

.gepD4-output-row {
    display: flex; /* 启用 Flexbox 布局 */
    align-items: center; /* 垂直居中对齐所有项目 */
    margin-bottom: 5px;
    margin-right: 10px;
    text-align: left;
    width: 360px;
    height: 50px;

}

.gepD4-output-row label {
    display: inline-block;
    width: auto;
    min-width: 80px;
    font-size: 16px;
    color: #6ff2f1;
    text-align: left;
    margin-bottom: 5px;
    margin-left: 10px;
}


.gep-output-calculator {
    position: relative;
    min-height: 300px; /* 可根据实际情况设定 */
    height: 100%;
    /*border: 1px red solid;*/
}

.bottom-button-container {
    /*border: 1px red solid;*/
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-around;
    padding-left: 10px;
}

.bottom-button-container-return {
    /*border: 1px red solid;*/
    position: absolute;
    bottom: 50px;
    left: 600px;
    right: 0;
    display: flex;
    justify-content: space-around;
}


/* 新增返回按钮样式 */
.return-button {
    /*background-color: #166534; !* green-900 对应的十六进制颜色 *!*/
    /*color: white;*/

    background-color:rgb(16, 37, 37); /* green-900 对应的十六进制颜色 */
    color: #26dada;

    font-weight: bold;
    padding: 0.5rem 1rem; /* py-2 px-4 对应的 padding */
    border-radius: 0.25rem; /* rounded 对应的 border-radius */
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    border: none;
}

.return-button:hover {
    /*background-color: #15803d; !* green-700 对应的十六进制颜色 *!*/
    background-color: rgb(21, 50, 50); /* green-700 对应的十六进制颜色 */
}

.return-button svg {
    margin-right: 0.5rem; /* mr-2 对应的 margin-right */
    width: 1.5rem; /* w-6 对应的 width */
    height: 1.5rem; /* h-6 对应的 height */
}


.image-container {
    height: 100%;
    width: 50%;
    display: flex;
    flex-direction: column;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 20px;

    /*
      margin-top: 90px;
    justify-content: center;
    */
    align-items: center;

}